<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<link href="../css/style.css" rel="stylesheet" type="text/css">
<link href="../css/style2.css" rel="stylesheet" type="text/css">
<head>
    <meta charset="UTF-8">
    <title>分类</title>
</head>
<body>
<div class="headBarContainer">
    <div class="itemsContainer">
        <nav>
            <ul>
                <li class="headItem"><a href="index.jsp">首页</a></li>
                <li class="headItem" id="clicked"><a href="/index/products">分类</a></li>
                <li class="headItem"><a href="enterMyJsp.action">我的</a>
            </ul>
        </nav>
    </div>
    <div th:if="${session.userId}!=null" class="logButton" id="logIn">
        <a th:href="@{/user/exit}">
            <div>退出</div>
        </a>
    </div>
    <div th:if="${session.userId}==null" class="logButton" id="logIn">
        <a href="/index/login">
            <div>登录</div>
        </a>
    </div>
    <div th:if="${session.userId}==null" class="logButton" id="signIn">
        <a href="/index/login">
            <div>注册</div>
        </a>
    </div>

</div>

<div class="searchBarContainer">
    <div class="searchBar">
        <div><img src="../images/icon.png"/></div>
        <form action="queryApiByName.action" method="post">
            <div id="inputContainer"><input id="textValue" type="text" placeholder="请输入商品名称" name="productName"></div>
            <div><input id="submitButton" type="submit" value="搜索"/></div>
        </form>
    </div>
</div>
<!--标签-->
<div class="tagsContainer">
    <text>标签：</text>
    <a href="queryApiByType.action?productType=0" class="tag">
        <text>电子产品</text>
    </a> <a
        href="queryApiByType.action?productType=1" class="tag">
    <text>手表</text>
</a> <a href="queryApiByType.action?productType=2"
        class="tag">
    <text>车辆</text>
</a> <a href="queryApiByType.action?productType=3" class="tag">
    <text>土地</text>
</a>
    <a href="queryApiByType.action?productType=4" class="tag">
        <text>书法</text>
    </a> <a href="queryApiByType.action?productType=5"
            class="tag">
    <text>瓷器</text>
</a> <a href="queryApiByType.action?productType=6" class="tag">
    <text>名画</text>
</a>
    <a href="queryApiByType.action?productType=7" class="tag">
        <text>其他</text>
    </a>
</div>
<!--搜索结果-->
<div class="resultContainer">
    <div id="title">
        关键词
        <text id="keyword">
            <th:property value="productName"/>
        </text>
        的搜索结果为:
    </div>
    <div class="shopArea">
        <div class="body">
            <ul>
                <li th:each="pi : ${productList}">
                    <div class="shop" th:id="${pi.auctionType}eq'正在拍卖'?'now':'later'">
                        <div class="picContainer">
                            <img th:src="${pi.productPhotos}">
                        </div>
                        <div class="shopName">
                            <label th:text="${pi.productName}">
                            </label>
                        </div>
                        <div>
                            <label>当前价:</label><label th:text="'￥'+${pi.nowPrice}" class="price">
                        </label>
                        </div>
                        <div th:if="${pi.auctionType}eq'正在拍卖'">
                            <label>预计于&nbsp&nbsp&nbsp&nbsp</label>
                            <label th:text="${#dates.format(pi.endTime,'MM-dd HH:mm')}" class="endTime">
                            </label>
                            <label>&nbsp&nbsp&nbsp结束</label>
                        </div>
                        <div th:unless="${pi.auctionType}eq'正在拍卖'">
                            <label>将&nbsp&nbsp&nbsp于&nbsp&nbsp&nbsp&nbsp</label>
                            <label th:text="${#dates.format(pi.startTime,'MM-dd HH:mm')}" class="startTime">
                            </label>
                            <label>&nbsp&nbsp&nbsp开始</label>
                        </div>
                        <div>
                            <label>底&nbsp&nbsp&nbsp价&nbsp</label><label th:text="'￥'+${pi.floorPrice}" class="startPrice">
                        </label>
                        </div>
                        <a th:href="@{/product/{proId}(proId=${pi.productId})}">
                            <div class="button">
                                <text>报名参与</text>
                            </div>
                        </a>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</div>
</body>
</html>